.form-dimensions-input {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;

	&.no-wrap {
		flex-wrap: nowrap;

		.form-dimensions-input__length,
		.form-dimensions-input__width {
			border-bottom-width: 1px;
		}
	}

	@include breakpoint-deprecated( '>480px' ) {
		flex-wrap: nowrap;

		.form-text-input-with-affixes {
			flex-grow: 2;
			flex-direction: row;
		}
	}

	.form-dimensions-input__length,
	.form-dimensions-input__width {
		border-bottom-width: 0;
		@include breakpoint-deprecated( '>480px' ) {
			border-bottom-width: 1px;
		}
	}

	.form-dimensions-input__width,
	.form-dimensions-input__height {
		@include breakpoint-deprecated( '>480px' ) {
			margin-left: -1px;
		}
	}

	.form-dimensions-input__length,
	.form-dimensions-input__width,
	.form-dimensions-input__height {
		@include breakpoint-deprecated( '>480px' ) {
			width: 70px;
			flex-grow: 0;
		}

		&:hover,
		&:focus {
			transform: scale( 1 );
		}

		&:focus + .form-dimensions-input__width:hover,
		&:focus + .form-text-input-with-affixes .form-dimensions-input__height:hover {
			transform: none;
		}
	}

	.form-text-input-with-affixes__suffix {
		flex-grow: 0;
	}

	.form-dimensions-input__height {
		@include breakpoint-deprecated( '>480px' ) {
			width: 80px;
		}
	}
}
